.create-store-record {
  min-height: 100vh;
  padding-bottom: 140rpx;
  background-color: #f6f6f6;

  .form-main {
    padding: 22rpx;
  }
}

// 类型项盒子的公共样式
@mixin boxCommon() {
  margin-top: 20rpx;
  padding: 0 22rpx;
  background-color: #ffffff;
  border-radius: 10rpx;

  font-size: 30rpx;
  color: #666666;
}

// 小标题
.top-title {
  padding: 22rpx 0;
  border-bottom: 1px solid #eee;
  font-size: 26rpx;
  color: #666;

  .right-btn {
    text {
      margin-left: 12rpx;
      vertical-align: 2rpx;
    }
  }

  .requiredIcon {
    color: #eb5c02;
  }

  .sub-title {
    font-size: 18rpx;
    padding-left: 10rpx;
  }
}

// 车辆信息
.car-info {
  @include boxCommon();
  margin-top: 0;

  .car {
    height: 110rpx;

    .content {
      .row {
        line-height: 40rpx;
        font-size: 26rpx;
        color: #333;
      }
      .img {
        width: 40rpx;
        height: 40rpx;
        margin-right: 20rpx;
      }
    }

    // 暂无车辆
    .not-car {
      line-height: 110rpx;
      text-align: center;
      color: #999999;
      font-size: 26rpx;
      text-align: center;
    }
  }
}
// 选择车辆弹框
.popup-addcar {
  .title {
    height: 90rpx;
    line-height: 90rpx;
    border-bottom: 1px solid #eee;
    font-size: 34rpx;
    font-weight: 500;
    color: #333333;
    text-align: center;
  }
  .content {
    .item {
      height: 104rpx;
      line-height: 104rpx;
      font-size: 30rpx;
      font-weight: 500;
      color: #666666;
      text-align: center;
      vertical-align: 0;
    }
  }
}

// 其他车辆信息
.car-other-info {
  @include boxCommon();

  .row {
    height: 100rpx;
    line-height: 100rpx;

    & + .row {
      border-top: 1px solid #eee;
    }

    .requiredIcon {
      color: #eb5c02;
    }

    .gender {
      margin-right: 120rpx;
    }

    .gender-text {
      padding-left: 20rpx;
    }

    .car-number {
      margin-left: 275rpx;
      width: 120rpx;
    }

    input {
      padding-right: 20rpx;
      text-align: right;
      font-size: 30rpx;
      // width: 100%;
    }
  }
}

// 服务类型
.serve-type {
  @include boxCommon();

  // 多选样式穿透
  & /deep/ .u-checkbox {
    margin-top: 32rpx;

    &:nth-child(1),
    &:nth-child(2),
    &:nth-child(3) {
      margin-top: 0;
    }

    &:nth-child(3n + 2) {
      padding-left: 20rpx;
    }

    &:nth-child(3n + 3) {
      width: 20% !important;
      justify-content: flex-end;
    }
  }
}

// 排队类型
.queue-type {
  @include boxCommon();

  // 多选样式穿透
  & /deep/ .u-checkbox {
    margin-top: 32rpx;

    &:nth-child(1),
    &:nth-child(2) {
      margin-top: 0;
    }
  }
}

// 多选样式穿透
.checkbox-content {
  padding: 26rpx 0;
}

// 创建按钮
.btn-create {
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 9;
  width: 100%;
  height: 120rpx;
  padding: 16rpx 24rpx;
  background-color: #fff;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);

  .btn {
    background: linear-gradient(-90deg, #fdd421, #ffe23e);
    border-radius: 44rpx;
    font-size: 32rpx;
    font-weight: 500;
    color: #333333;

    &::after {
      border: 0;
    }
  }
}

// 提示弹框
.popup-content {
  padding: 30rpx 46rpx;
  text-align: center;

  .title {
    font-size: 34rpx;
    font-weight: bold;
    color: #333333;
  }

  .content {
    padding: 46rpx 0;
    font-size: 28rpx;
    font-weight: 500;
    color: #666666;
  }

  .btn-box {
    .btn {
      height: 78rpx;
      font-size: 30rpx;
      color: #333;
    }

    .btn-left {
      width: 50%;
      border-radius: 39rpx 0 0 39rpx;
      height: 78rpx;
      font-size: 30rpx;
      background: #333;
      color: #ffe23e;
    }

    .btn-right {
      width: 50%;
      border-radius: 0 39rpx 39rpx 0;
      height: 78rpx;
      font-size: 30rpx;
      color: #333;
      background: linear-gradient(-90deg, #fdd421, #ffe23e);
    }
  }

  button {
    background: linear-gradient(-90deg, #fbd220, #ffe23e);
    border-radius: 44rpx;

    &::after {
      border: 0;
    }
  }
}
